<template>
  <painting-monitor-svg :dataList="dataList" :style="svgStyle"></painting-monitor-svg>
</template>
<script>
import PaintingMonitorSvg from '@/components/monitor-svg/painting-monitor-svg'
import { setInterval } from 'timers';
export default {
  name: 'PaintingWorkshopMonitor',
  components: { PaintingMonitorSvg },
  data() {
    return {
      svgStyle: {width: '100%', height: '100%'},
      // test
      dataList: [0, 1, 2],
      set: null
    }
  },
  mounted() {
    this.svgStyle.height = document.documentElement.clientHeight - 100 + 'px'
    this.set = setInterval(() => {
      this.dataList = this.randomData()
    }, 1000)
  },
  methods: {
    randomData() {
      return [Math.floor(Math.random() * 3), Math.floor(Math.random() * 3), Math.floor(Math.random() * 3)]
    }
  },
  destroyed() {
    clearInterval(this.set)
  }
}
</script>